let table_div = {
    "id": "tb_id",
    "sort": {
        "key": "chat_total",
        "sort": true
    },
    "title": [{
        "key": "name",
        "value": "姓名"
    },
        {
            "key": "chat_total",
            "value": "群总数",
        },
        {
            "key": "new_chat_cnt",
            "value": "新增群"
        }, {
            "key": "UrdCnt",
            "value": "随机"
        }],
    "group": [
        {
            "head": [
                {
                    "UrdCnt": '',
                    "chat_total": '',
                    "name": "头",
                    "new_chat_cnt": '',
                }
            ],
            "context": [

                {
                    "UrdCnt": 1,
                    "chat_total": 7,
                    "name": "a",
                    "new_chat_cnt": 6,
                },
                {
                    "UrdCnt": 2,
                    "chat_total": 8,
                    "name": "b",
                    "new_chat_cnt": 5,
                },
                {
                    "UrdCnt": 3,
                    "chat_total": 9,
                    "name": "c",
                    "new_chat_cnt": 4,
                }
            ]
        }, {
            "head": [
                {
                    "UrdCnt": '',
                    "chat_total": '',
                    "name": "身",
                    "new_chat_cnt": '',
                }
            ],
            "context": [

                {
                    "UrdCnt": 1,
                    "chat_total": 7,
                    "name": "a",
                    "new_chat_cnt": 6,
                },
                {
                    "UrdCnt": 2,
                    "chat_total": 8,
                    "name": "b",
                    "new_chat_cnt": 5,
                },
                {
                    "UrdCnt": 3,
                    "chat_total": 9,
                    "name": "c",
                    "new_chat_cnt": 4,
                }
            ]
        }, {
            "head": [
                {
                    "UrdCnt": '',
                    "chat_total": '',
                    "name": "尾",
                    "new_chat_cnt": '',
                }
            ],
            "context": [

                {
                    "UrdCnt": 1,
                    "chat_total": 45,
                    "name": "a",
                    "new_chat_cnt": 6,
                },
                {
                    "UrdCnt": 2,
                    "chat_total": 8,
                    "name": "b",
                    "new_chat_cnt": 5,
                },
                {
                    "UrdCnt": 3,
                    "chat_total": 9,
                    "name": "c",
                    "new_chat_cnt": 4,
                },
                {
                    "UrdCnt": 3,
                    "chat_total": 9,
                    "name": "c",
                    "new_chat_cnt": 4,
                },
                {
                    "UrdCnt": 3,
                    "chat_total": 9,
                    "name": "c",
                    "new_chat_cnt": 4,
                }
            ]
        }
    ]
}
f(table_div)


function compare(p) { //这是比较函数
    return function (m, n) {
        let a = m[p];
        let b = n[p];
        return a-b; //升序
    }
}

function f(tb_object) {
    console.log(tb_object)
    /*填充组头数据*/
    if (tb_object['group'] !== undefined) {
        let groups = tb_object['group'];
        groups.forEach((groupsValue, groupsKey) => {
            /*遍历组头（组头可能有多个）*/
            groupsValue.head.forEach((headValue, headKey) => {
                /*遍历表头，拿到key获取组头的对应值*/
                tb_object.title.forEach((tb_title_value)=> {
                    /*组头的当前值*/
                    let temp = headValue[tb_title_value.key];
                    /*组头的临时值*/
                    let tempGroupValue = 0;
                    /*如果组头的当前值为空，则为组头赋值*/
                    if (temp === undefined || temp === '' || temp === null) {
                        groupsValue.context.forEach((contextValue) => {
                            tempGroupValue += contextValue[tb_title_value.key]
                        })
                        tb_object.group[groupsKey].head[headKey][tb_title_value.key] = tempGroupValue
                    }
                })
            })
        })
    } else {
        return;
    }
    console.log(tb_object)
    console.log(tb_object.sort.key)
    let array;
    array=tb_object.group
    console.log(array)
    array.sort(compare("new_chat_cnt"))
    console.log(array)

    add_table(tb_object);
}


function add_table(table_object) {
    let title, groups, title_ele = ``, group_ele = ``, id;
    if (table_object['id'] !== undefined) {
        id = table_object['id'];
    }
    title_ele += `<table>`;
    if (table_object['title'] !== undefined) {
        title = table_object['title'];
        title_ele += `<tr>`
        for (let titleElement of title) {
            title_ele += `<th>` + titleElement.value + `</th>`
        }
        title_ele += `</tr>`
    } else {
        return;
    }
    if (table_object['group'] !== undefined) {
        groups = table_object['group'];
        console.log(groups)
        for (let group of groups) {
            for (let headElement of group.head) {
                group_ele += `<tr>`
                for (let titleElement of title) {
                    group_ele += `<td>` + headElement[titleElement.key] + `</td>`
                }
                group_ele += `</tr>`
            }
            // console.log(contexts.context)
            for (let contextElement of group.context) {
                // console.log(contextElement)
                group_ele += `<tr>`
                /*遍历表头，获取一行每一单元格的值*/
                for (let titleElement of title) {
                    group_ele += `<td>`
                        + contextElement[titleElement.key]
                        + `</td>`
                }
                group_ele += `</tr>`
            }
        }
        title_ele += group_ele;
    } else {
        return;
    }
    title_ele += `</table>`;
    let elementById = document.getElementById(id);
    elementById.innerHTML = title_ele;
}